<template>
  <div class="unlogin__con">
    <img :src="img11" alt="" class="unlogin_image" />
    <div class="unlogin_btn" @click="joinThis">
      立即参与
    </div>
  </div>
</template>

<script>
import { mainApi } from "@/service";
import { img11 } from "@/constant";
export default {
  data: function() {
    return {
      img11
    };
  },
  methods: {
    async joinThis() {
      await mainApi();
    }
  }
};
</script>

<style lang="scss" scoped>
@import "@/app.scss";

.unlogin__con {
  background: #ffffff;
  border-radius: 30px;
  height: 435px;
  margin-top: 30px;
  @include flex_config(center, center, column);

  .unlogin_image {
    width: 195px;
  }

  .unlogin_btn {
    width: 454px;
    height: 110px;
    margin: 28px auto 0 auto;
    background: linear-gradient(90deg, #fc6142, #f9412c);
    border-radius: 55px;
    font-size: 34px;
    font-weight: 800;
    color: #ffffff;
    line-height: 110px;
    text-align: center;
  }
}
</style>
